<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    列表标签
    无序列表  ul li
    有序列表  ol li
    自定义列表  dl  dt dd
    <dl>
        <dt>早餐</dt>
        <dd>包子</dd>
        <dd>油条</dd>
        <dd>豆浆</dd>

        <dt>晚餐</dt>
        <dd>水果沙拉</dd>
    </dl>

    <dl>
        <dt>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Itaque quos inventore ad exercitationem dignissimos harum esse modi. In reiciendis, alias delectus dolore iure porro temporibus minima quia incidunt ea ut?</dt>
        <dd style="text-align: right;">--XXX</dd>
    </dl>


    <ul>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
    </ul>

    <ol>
        <li>aaaa</li>
        <li>aaaa</li>
        <li>aaaa</li>
    </ol>

    <!-- 快捷操作  + tab
    ul>li{bbb}*5 -->

    <!-- body里面最大的块级标签,可以容纳任何标签 -->
    <div>
        <ol>
            <li>aaaa</li>
            <li>aaaa</li>
            <li>aaaa</li>
        </ol>
        <h1>1111</h1> 
        <i>111</i>
    </div>

    <!-- body里面最大的行内标签,可以容纳任何行内标签 -->
    <span>aaa</span>
    <span>
        <i>bbb</i>
        <strong>ccc</strong>
    </span>

    块级标签 ：可以包含任何body标签 
    行内标签 : 只能包含行内标签
    行内块标签:可以包含行内和行内块
</body>
</html>